<template>
    <div>
        <el-dialog
            title="转移客户"
            width="500px"
            :visible.sync="dialogVisible"
        >
            <el-form
                ref="ruleForm"
                :model="form"
                :rules="rules"
                label-width="80px"
            >
                <el-row>
                    <el-col :span="24">
                        <el-form-item
                            label="接收用户"
                            prop="member_id"
                        >
                            <el-select
                                v-model="form.member_id"
                                placeholder="请选择人员"
                                style="width: 100%;"
                            >
                                <el-option
                                    v-for="(item, index) in memberList"
                                    :key="index"
                                    :label="item.realname"
                                    :value="item.id"
                                />
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div
                slot="footer"
                class="dialog-footer"
            >
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button
                    type="primary"
                    @click="handleSubmit"
                >
                    确 定
                </el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
import { transfer } from '@/api/kehu'
import { memberList } from '@/api/system'
export default {
    name: 'UserTransferDialog',
    data() {
        return {
            dialogVisible: false,
            memberList: [],
            form: {},
            rules: {
                member_id: [{ required: true, message: '请选择人员', trigger: 'change' }]
            }
        }
    },
    methods: {
        showDialog(list) {
            if (list.length) {
                let ids = list.map(item => {
                    return item.id
                })
                this.form.ids = ids.join(',');
                
                // this.resetParams();
                this.resetForm();
                this.getOptions();
                this.dialogVisible = true;
            }
        },
        resetForm() {
            this.$nextTick(() => {
                this.$refs.ruleForm.resetFields();
            })
        },
        resetParams() {
            this.form.member_id = null;
        },
        handleSubmit(e) {
            this.$refs.ruleForm.validate(valid => {
                if (valid) {
                    transfer(this.form).then(res => {
                        if (res.status == '1') {
                            this.$message.success('转移成功！')
                            this.$emit('success', res)
                        } else {
                            this.$message.error(res.message)
                        }
                    }).finally(() => {
                        this.dialogVisible = false
                    })
                }
            })
        },
        // 获取 options
        getOptions() {
            memberList().then(res => {
                this.memberList = res.data.list || []
            })
        }
    }
}
</script>